<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <meta name="format-detection" content="telephone=no" />
        <title>订单管理</title>
        <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
        <link rel="stylesheet" type="text/css" href="../../css/common.css" />
        <style>
            body{
                font-size: 14px;
            }
            .headUl{
                font-size: 14px;
            }
            .headUl li{
                width: 20%;
                color: #000;
            }
            .headUl li span{
                font-size: 14px;
            }
            .headUl li.active span{
                display: inline-block;
                position: relative;
            }
            .headUl li.active span:before{
                content: "";
                width: 100%;
                bottom: 0;
                height: 2px;
                left: 0;
                position: absolute;
                background: #ff3333;
            }
            .headUl {
                width: 100%;
                display: box;
                display: -webkit-box;
                box-sizing: border-box;
                font-size: 16px;
                height: 45px;
                background-color: #fff;
                /*overflow: hidden;*/
            }
        </style>
    </head>
    <body>
        <header class="aui-bar aui-bar-nav">
            <div class="aui-pull-left aui-iconfont aui-icon-left icon-left-coler" tapmode onclick="closeWin()"></div>
            <div class="aui-title">
                订单管理
            </div>
            <ul class="headUl aui-border-t aui-border-b">
                <li class="active" data-type="1" tapmode onclick="switchChange(this)">
                    <span>全部</span>
                </li>
                <li data-type="2" tapmode onclick="switchChange(this)">
                    <span>待付款</span>
                </li>
                <li data-type="3" tapmode onclick="switchChange(this)">
                    <span>待发货</span></span>
                </li>
                <li data-type="4" tapmode onclick="switchChange(this)">
                    <span>已发货</span>
                </li>
                <li tapmode  onclick="switchChange(this)">
                    <span>已完成</span>
                </li>
            </ul>
        </header>
    </body>
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/common.js"></script>
    <script type="text/javascript" src="../../script/jquery-1.11.3.js"></script>
    <script type="text/javascript">
        apiready = function() {
            api.parseTapmode();
            var mobile = api.pageParam.mobile;
            var header = $api.dom('header');
            var searchContent= api.pageParam.content;
            if(searchContent){
                alert(searchContent)
            }
            //$api.fixStatusBar(header);
            api.setStatusBarStyle({
                style : 'light'
            });
            var header_h = $api.offset(header).h;
            var body_h = $api.offset($api.dom('body')).h - header_h;
            api.openFrame({
                name : 'orderManage_frm',
                url : 'orderManage_frm.html',
                rect : {
                    x : 0,
                    y : header_h,
                    w : 'auto',
                    h : body_h
                },
                pageParam : {
                    mobile : mobile
                },
                bounces : false,
                vScrollBarEnabled : false,
                hScrollBarEnabled : false
            });
        }
        
        function switchChange(obj) {
            $('.headUl li').removeClass('active');
            $(obj).addClass('active');
            var type = $(obj).attr('data-type');
            api.sendEvent({
                name: 'lizi_type',
                extra: {
                    lizi_type: type
                }
            })
        }
    </script>
</html>
